require(["./config"], () => {
  require(["template", "footer"], template => {
    class ShoppingCart {
      constructor() {
        this.init();
        // this.ShopSummary();

        this.AllSelect();
        this.Total();
        this.Minus();
        this.Plus();
        this.setDel();
      }
      init() {
        // console.log();
        // 取出localStorage完成列表渲染
        let cart = localStorage.getItem("cart");
        if (cart) {
          this.cart = JSON.parse(cart);
          this.render();
          this.checksChange();
          this.calcTotalMoney();
          // this.AllSelect();
        } else {
          $("#shopping_car").hide();
          $("#cart-empty").show();
        }
      }
      render() {
        console.log(this.cart);
        $("#shop_tbody").html(template("srcShop", { cartList: this.cart }));
      }
      checksChange() {
        const _this = this;
        $("#shop_tbody .checks").on("change", function() {
          // 从当前input出发，在tr身上拿到当前商品的id
          const id = Number(
            $(this)
              .parents("li")
              .attr("data-id")
          );
          console.log(id);
          // 根据id修改当前商品的check属性
          _this.cart = _this.cart.map(shop => {
            if (shop.id === id) shop.check = $(this).prop("checked");
            return shop;
          });
          // 把_this.cart修改之后的数据重新存localStorage
          localStorage.setItem("cart", JSON.stringify(_this.cart));
          // 把数据修改了以后重新调用一下计算总价的方法就行了
          _this.calcTotalMoney();
          // 每一次单选切换了状态都要判断全选然后设置状态
          _this.setAllcheckStatus();
        });
      }
      calcTotalMoney() {
        // 不管如何修改，都根据数据从头算
        const money = this.cart.reduce((sum, shop) => {
          // console.log($("#Counts").val());
          if (shop.check) {
            sum += shop.price * shop.count;
          }
          return sum;
        }, 0);

        $("#Paymoney").html(money);
      }
      //合计多少件

      setAllcheckStatus() {
        $("#all-check").prop(
          "checked",
          this.cart.every(shop => shop.check)
        );
        // const isAll = this.cart.every(shop => {
        //   return shop.check === true
        // })
        // $('#all-check').prop('checked', isAll)
      }

      //全选全不选

      AllSelect() {
        this.list = JSON.parse(localStorage.getItem("cart"));
        $("#all-check").prop(
          "checked",
          this.list.every(item => item.check)
        );
        $("#all-check").on("change", () => {
          if ($("#all-check").prop("checked")) {
            for (let i = 0; i < this.list.length; i++) {
              this.list[i].check = true;
            }
            localStorage.setItem("cart", JSON.stringify(this.list));
            $("#all-check").prop("checked", true);
            $(".checks").prop("checked", true);
          } else {
            for (let i = 0; i < this.list.length; i++) {
              this.list[i].check = false;
            }
            localStorage.setItem("cart", JSON.stringify(this.list));
            $("#all-check").prop("checked", false);
            $(".checks").prop("checked", false);
          }
          localStorage.setItem("cart", JSON.stringify(this.cart));
          // this.calcTotalMoney();
          // this.checksChange();
        });
      }
      //相加
      Minus() {
        const _this = this;
        let num;
        $(".plus").on("click", function() {
          const id = Number(
            $(this)
              .parents("li")
              .attr("data-id")
          );
          _this.cart = _this.cart.map(shop => {
            if (shop.id === id) {
              num = shop.count += 1;
            }
            return num, shop;
          });
          localStorage.setItem("cart", JSON.stringify(_this.cart));
          $(this)
            .siblings(".Counts")
            .val(num);
          _this.calcTotalMoney();
          _this.Total();
        });
      }
      //相减
      Plus() {
        const _this = this;
        let nums;
        $(".minus").on("click", function() {
          const id = Number(
            $(this)
              .parents("li")
              .attr("data-id")
          );
          let shop = _this.cart.map(shop => {
            console.log(_this.cart);
            if (shop.id === id && shop.count > 0) {
              nums = shop.count--;
            }
            return nums, shop;
          });
          localStorage.setItem("cart", JSON.stringify(_this.cart));
          $(this)
            .siblings(".Counts")
            .val(nums);
          _this.calcTotalMoney();
          // _this.setAllcheckStatus();
          _this.Total();
        });
      }
      //删除
      setDel() {
        let _this = this;
        $(".caozuo").on("click", "i", function() {
          // console.log(1111);
          let del = confirm("确认删除吗？");
          if (del) {
            // console.log(_this.cart);
            let res = _this.cart.filter(item => item.check === false);
            localStorage.setItem("cart", JSON.stringify(res));
            parent.location.reload();
          }
        });
      }
      Total() {
        let summs = 0;
        $(".Counts").each(function(i) {
          summs = summs + parseInt($(this).val());
        });
        $("#ShopCount").text(summs);
      }
    }

    new ShoppingCart();
  });
});
